<template>
    <div>
        <van-uploader v-model="fileList" :after-read="afterRead" accept=".xlsx" />
        <button @click="download">下载</button>
        <van-image
                width="10rem"
                height="10rem"
                fit="contain"
                :src="imgHref"
        />
    </div>
</template>

<script>
    import {downFile} from "../api/manage";
    import axios from 'axios'
    export default {
        name: "testUploader",
        data() {
            return {
                fileList: [
                    {
                        url: 'https://img.yzcdn.cn/vant/leaf.jpg',
                        status: 'uploading',
                        message: '上传中...',
                    },
                    {
                        url: 'https://img.yzcdn.cn/vant/tree.jpg',
                        status: 'failed',
                        message: '上传失败',
                    },
                ],
                imgHref:''
            };
        },
        methods: {
            afterRead(file) {
                console.log(file);
                file.status = 'uploading';
                file.message = '上传中...';
                let data =new FormData();
                data.append('file',file.file)
                data.append('openid','cshe')
                data.append('type','icon')
                console.log('>>>>',data)

                axios.post('/auth/upload',data).then(res =>{
                    console.log(res)
                    file.status = 'success';
                    file.message = '上传成功';
                }).catch(err =>{
                    console.log(err)
                    file.status = 'failed';
                    file.message = '上传失败';
                })

            },
            download(){
                const file ={
                    group:'group1',
                    path: 'M00/00/00/wKgKG16ejE-ARxXOAAC2QCV_I_0287.png',
                    fileName:'测试.png'
                }
                axios({  url: 'auth/download',
                    params: file,
                    method:'get' ,
                    responseType: 'blob'}).then(res=>{
                        console.log('<<<<',res)
                    this.imgHref=res.request.responseURL
                })
                downFile('auth/download',file).then(res=>{
                    console.log(res)

                    let blob = new Blob([res], {type: res.type})
                    let downloadElement = document.createElement('a')
                    let href = window.URL.createObjectURL(blob); //创建下载的链接
                    console.log(href)
                    downloadElement.href = href;
                    downloadElement.download = '测试.png'; //下载后文件名
                    document.body.appendChild(downloadElement);
                    downloadElement.click(); //点击下载
                    document.body.removeChild(downloadElement); //下载完成移除元素
                    window.URL.revokeObjectURL(href); //释放blob对象
                }).catch(err =>{
                    console.log(err)
                })
            }
        },
    }
</script>

<style scoped>

</style>